import 'package:flutter/material.dart';

class Exam_11 extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(
        title: Text("弹性布局Flex"),
      ),
      body: Content(),
    );
  }
  
}

class Content extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Column(
      children: <Widget>[
        /**1.Flex得子组件水平按照1：1来分配空间*/
       Flex(direction: Axis.horizontal,
        children: <Widget>[
          Expanded(
            flex: 1,
            child: Container(
              height: 30.0,
              color: Colors.red,
            ),
          ),
          Expanded(
            flex: 1,
            child: Container(
              height: 30.0,
              color: Colors.grey,
            ),
          ),
        ],
       ),

        /**2.*/
        Padding(
          padding: const EdgeInsets.only(top: 100.0),
          child: SizedBox(
            height: 100.0,
            child: Flex(direction: Axis.vertical,
              children: <Widget>[
                Expanded(child: Container(
                  height: 30.0,
                  color: Colors.blue,
                )),
                Spacer( //Spaceer得功能是占用指定比例得空检，是Expanded得一个包装类
                  flex: 1,
                ),
                Expanded(
                  flex: 1,
                  child: Container(
                    height: 30.0,
                    color: Colors.orange,
                  ),
                ),
              ],
            ),
          ),
        ),
      ],
    );
  }

}